<template>
  <div>
    <avue-form v-loading="loading" ref="form" :option="option" v-model="form">
      <template slot="supplierName">
        <el-input class="pointer" v-model="form.supplierName" @focus="openSupplier" placeholder="请选择" readonly>
          <i slot="suffix" class="el-icon-search"></i>
        </el-input>
      </template>
      <template slot="materialCategory">
        <material-classify v-model="form.materialCategory" />
      </template>
      <p slot="menuForm" style="width: 100%; border: 1px solid #ccc" class="line"></p>
    </avue-form>
  </div>
</template>

<script>
import { baseOption } from '@/option/tenant/supplier/audit-form'
export default {
  name: 'AuditBase',
  inject: ['type'],
  props: {
    baseInfo: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  data() {
    return {
      form: {},
      loading: false,
      option: baseOption.call(this)
    }
  },
  watch: {
    form: {
      handler(val) {
        this.$emit('update:baseInfo', val)
      },
      deep: true
    }
  },
  methods: {
    openSupplier() {
      this.$quickModal({
        title: '选择供应商',
        width: '900px',
        componentIsTag: true,
        component: 'suppliers',
        props: {
          multiple: false
        },
        on: {
          change: row => {
            console.log(row)
          }
        }
      })
    }
  }
}
</script>

<style></style>
